{% extends 'base.html' %}
{% block body %}
    <section class="section">
        <div class="container">
            <div class="row">
                <div class="col-md-8 col-sm-7">
                    {% for article in articles.object_list %}
                        <article class="card">
                            <div style="float: right;position: relative;">
                                <h3>
                                    {% if article.category == '0' %}
                                        <span class="label label-info">原创</span>
                                    {% elif article.category == '1' %}
                                        <span class="label label-warning">转载</span>
                                    {% endif %}
                                </h3>
                            </div>
                            <div class="card__header">
                                <h2><a href="{% url 'article' article.id %}" style="color: #2e353b">{{ article.title }}</a></h2>
                                <small>
                                    <span><span style="font-weight: bold">作者</span>：<span class="badge label-info">{{ article.author }}</span> </span>
                                    <span><span style="font-weight: bold">发布时间</span>：{{ article.created_time }}</span>
                                    <span><span style="font-weight: bold">浏览</span>（{{ article.read }}）</span>
                                    <span><span style="font-weight: bold">评论</span>（<span id = "sourceId::{{ article.id }}" class = "cy_cmt_count" ></span>）</span>
                                    <span><span style="font-weight: bold">分类</span>：{{ article.get_categories }}</span>
                                    <span><span style="font-weight: bold">标签</span>：{{ article.get_tag }}</span>
                                </small>
                            </div>
                            <div class="card__body">
                                <div id="test-editormd-view{{ article.id }}">
                        <textarea id="append-test" style="display:none;">{{ article.description }}</textarea>
                                </div>
                                <div class="blog-more">
                                    <a href="{% url 'article' article.id %}">阅读全文</a>
                                </div>
                            </div>
                        </article>
                    {% endfor %}
                <!--广告-->
                <a data-type="3" data-tmpl="600x90" data-tmplid="193" data-rd="2" data-style="2" data-border="2" href="#"></a>
                <!--广告结束-->
                    <nav class="text-center">
                        <ul class="pagination">
                            {# 是否有上一页 #}
                            {% if articles.has_previous %}
                                <li>
                                    <a href="?{{ articles.previous_page_number.querystring }}" aria-label="Previous">
                                        <i class="zmdi zmdi-chevron-left"></i>
                                    </a>
                                </li>
                            {% endif %}
                            {% for page in articles.pages %}
                                {% if page %}
                                    {% ifequal page articles.number %}
                                        {# 当前页 #}
                                        <li class="active"><a>{{ page }}</a></li>
                                    {% else %}
                                        {# 下一页 #}
                                        <li><a href="?{{ page.querystring }}">{{ page }}</a></li>
                                    {% endifequal %}
                                {% else %}
                                    {# 页数过多显示什么 #}
                                    <li class="none"><a href="">...</a></li>
                                {% endif %}
                            {% endfor %}

                            {# 是否有下一页 #}
                            {% if articles.has_next %}
                                <li>
                                    <a href="?{{ articles.next_page_number.querystring }}" aria-label="Next">
                                        <i class="zmdi zmdi-chevron-right"></i>
                                    </a>
                                </li>
                            {% endif %}
                        </ul>
                    </nav>
                </div>
                <aside class="col-md-4 col-sm-5 hidden-xs">
                    <div class="card subscribe">
                    	<a href="{% url 'about' %}">
                        <div class="subscribe__icon">
                        	<img src="/static/blog/img/timg.gif" class="img-circle" style="height: 200px;width: 200px">
                        </div>
                        <h2 style="color: #2e353b">魏先森</h2>
                        <small style="color: #9c9c9c">做一个有内涵的知识分享者</small>
                        </a>
                    </div>
                    <div class="card">
                        <div class="card__header">
                            <h2>分类</h2>
                            <small>Hello，Categories！</small>
                        </div>
                        <div class="list-group">
                            {% for category in categories %}
                                <a href="{% url 'index' %}?category={{ category.name }}" class="list-group-item media">
                                    <strong style="float: left">{{ category.name }}</strong><strong style="float: right">({{ category.categories_article_count }})</strong>
                                </a>
                            {% endfor %}
                            <div class="p-10"></div>
                        </div>
                    </div>


                    <div class="card tags-list">
                        <div class="card__header">
                            <h2>标签</h2>
                            <small>Hello，tags！</small>
                        </div>
                        <div class="card__body">
                            {% for tag in tags %}
                                <a href="{% url 'index' %}?tag={{ tag.name }}" class="tags-list__item">#{{ tag.name }}</a>
                            {% endfor %}
                        </div>
                    </div>

                    <div class="card">
                        <div class="card__header">
                            <h2>友情链接</h2>
                            <small>如果要交换友链，请联系我~</small>
                        </div>
                        <div class="list-group">
                            {% for link in links %}
                                <a href="{{ link.url }}" class="list-group-item media" target="_blank">
                                    <div class="media-body list-group__text">
                                        <strong>{{ link.name }}</strong>
                                        <small>{{ link.description }}</small>
                                    </div>
                                </a>
                            {% endfor %}
                            <div class="p-10"></div>
                        </div>

                    </div>
{#                <!--广告-->#}
{#                <script type="text/javascript">var jd_union_unid="1000244035",jd_ad_ids="536:6",jd_union_pid="CJ6/uvHyKxDDhvrcAxoAIJOn4/UDKgA=";var jd_width='auto';var jd_height=360;var jd_union_euid="";var p="AhMDVhlaFAIUDmVEH0hfIlgRRgYlXVZaCCsfSlpMWGVEH0hfIn48ZglDSWZAN345VV15HVNNE3xGSkFZF2scARoAVB1bEAoiB1QaWhYHFwZXH2slXVZaCCsQewMiWBFGBiUCFgZcGVocABEOVx9YJQMiN2U%3D";</script><script type="text/javascript" charset="utf-8" src="//u-x.jd.com/static/js/auto.js"></script>#}
{#                <a data-type="3" data-tmpl="300x250" data-tmplid="126" data-rd="2" data-style="2" data-border="1" href="#"></a>#}
{#                <!--广告结束-->#}
{#                <script type="text/javascript">#}
{#                    /*300*250 创建于 2017/10/19*/#}
{#                    var cpro_id = "u3117263";#}
{#                </script>#}
{#                <script type="text/javascript" src="http://cpro.baidustatic.com/cpro/ui/c.js"></script>#}
                <div class="card">
                        <div class="card__header">
                            <h2>无限新闻</h2>
                            <small>各种新闻使劲撸！~</small>
                        </div>
                        <div class="list-group">
                            <!-- cpu feeds block -->
                                <div class="cpu-feeds-block" data-site-id="275012152" data-block-id="4390"></div>
                                <script>
                                (function(){var url="//cpu.baidu.com";var getEntry=function(){var script=document.createElement("script");script.id="cpu-block-entry";script.src=url+"/js/cb_pc.js";var scriptTag=document.getElementsByTagName("script")[0];scriptTag.parentNode.insertBefore(script,scriptTag)};var sentMsg=function(e){var msg={msg:e.toString()||"no err msg",line:e.lineno||-1};var img=document.createElement("img");if(JSON){msg=encodeURIComponent(JSON.stringify(msg))}else{msg="&line="+msg.line+"&msg="+msg.msg}img.src=url+"/msg?m=block&e="+msg};try{window.feedsbycpu=window.feedsbycpu||[];window.feedsbycpu.push({siteId:"275012152",blockId:"4390",display:"auto"});document.getElementById("cpu-block-entry")||getEntry()}catch(e){sentMsg(e)}})();
                                </script>
                            <!-- cpu feeds block end-->
                            <div class="p-10"></div>
                        </div>

                    </div>

                </aside>
            </div>
        </div>
    </div>
<script type="text/javascript">
    (function(win,doc){
        var s = doc.createElement("script"), h = doc.getElementsByTagName("head")[0];
        if (!win.alimamatk_show) {
            s.charset = "gbk";
            s.async = true;
            s.src = "https://alimama.alicdn.com/tkapi.js";
            h.insertBefore(s, h.firstChild);
        };
        var o = {
            pid: "mm_54561653_26034128_141896909",/*推广单元ID，用于区分不同的推广渠道*/
            appkey: "",/*通过TOP平台申请的appkey，设置后引导成交会关联appkey*/
            unid: "",/*自定义统计字段*/
            type: "click" /* click 组件的入口标志 （使用click组件必设）*/
        };
        win.alimamatk_onload = win.alimamatk_onload || [];
        win.alimamatk_onload.push(o);
    })(window,document);
</script>
    </section>
{% endblock %}

{% block js %}
<script type="text/javascript">
        $(function () {
//          {% for article in articles.object_list %}
                var testEditormdView{{ article.id }};
                testEditormdView{{ article.id }} = editormd.markdownToHTML("test-editormd-view{{ article.id }}", {
                    htmlDecode: "style,script,iframe",
                    markdownSourceCode: true,
                    emoji: true,
                    taskList: true,
                    tex: true,
                    flowChart: true,
                    sequenceDiagram: true
                });
//          {% endfor %}
        });
    </script>
    <script id="cy_cmt_num" src="https://changyan.sohu.com/upload/plugins/plugins.list.count.js?clientId=cytgiwHpa"></script>
{% endblock %}